<template>
  <div class="publicformview">
    <el-form label-width='120px' :inline="true" :model="listQuery" :disabled='blockType==3' size="mini" ref="searchForm" style="margin-top: 20px;">
      <div class="publicformview-row">
        <el-form-item label="性质：" prop="livingway">
          <el-select v-model="listQuery.livingway" clearable @change="xinzhiChange">
            <div v-for="(item,index) in xingzhiList" :key="index">
              <el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
            </div>
          </el-select>
        </el-form-item>
        <template :span="6" v-if="listQuery.livingway=='住宅'">
          <el-form-item label="地段等级：" prop="addresslevelliving">
            <el-select v-model="listQuery.addresslevelliving" clearable>
              <div v-for="(item,index) in diduandengjiList" :key="index">
                <el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
              </div>
            </el-select>
          </el-form-item>
        </template>
        <template :span="6" v-if="listQuery.livingway=='非住宅'">
          <el-form-item label="地段等级：" prop="addresslevelnonliving">
            <el-select v-model="listQuery.addresslevelnonliving" clearable>
              <div v-for="(item,index) in diduandengjiList" :key="index">
                <el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
              </div>
            </el-select>
          </el-form-item>
        </template>
        <el-form-item label="混所：" prop="livingmix">
          <el-select v-model="listQuery.livingmix" clearable>
            <el-option label="是" value="是" key="1"></el-option>
            <el-option label="否" value="否" key="0"></el-option>
          </el-select>
        </el-form-item>
      </div>
      <div class="publicformview-row">
        <el-form-item label="建造年份：" prop="buildyear">
          <!-- 	<el-date-picker v-model="listQuery.buildyear" type="date" placeholder="年/月/日">
						</el-date-picker> -->
          <el-input type="number" v-model="listQuery.buildyear"></el-input>
        </el-form-item>
        <el-form-item label="幢号：" prop="buildingno">
          <el-input v-model="listQuery.buildingno"></el-input>
        </el-form-item>
        <el-form-item label="层数：" prop="floorcount">
          <el-input type="number" v-model="listQuery.floorcount"></el-input>
        </el-form-item>
        <el-form-item label="总间数：" prop="roomcount">
          <el-input disabled type="number" v-model="listQuery.roomcount"></el-input>
        </el-form-item>
      </div>
      <div class="publicformview-row">
        <el-form-item label="建筑形式：" prop="buildingform">
          <el-select v-model="listQuery.buildingform" @change="jianzhuChange" clearable>
            <div v-for="(item,index) in jianzhuxingshiList" :key="index">
              <el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
            </div>
          </el-select>
					<el-tooltip class="item" effect="dark" content="根据选择“楼房”或“平房”，后面的选择框要有变化。" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
        <el-form-item label="建筑形式明细：" prop="buildingformdetail">
          <el-select v-model="listQuery.buildingformdetail" @change="jianzhuChange" clearable>
            <div v-for="(item,index) in jianzhuxingshimingxiList" :key="index">
              <el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
            </div>
          </el-select>
        </el-form-item>
      </div>
      <div class="publicformview-row">

        <el-form-item label="房屋结构：" prop="structure">
          <el-select v-model="listQuery.structure" @change="fangwujiegouChange" clearable>
            <div v-for="(item,index) in fangwujiegouList" :key="index">
              <el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
            </div>
          </el-select>
					<el-tooltip class="item" effect="dark" content="选择后，“结构等别”的选择框要有变化" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
        <el-form-item label="结构等别：" prop="structuredetail">
          <el-select v-model="listQuery.structuredetail" @change="jiegoudengbieChange" clearable>
            <div v-for="(item,index) in jiegoudengbieList" :key="index">
              <el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
            </div>
          </el-select>
        </el-form-item>
        <el-form-item label="级别：" prop="structurelevel">
          <el-select v-model="listQuery.structurelevel" @change="jibieChange" key-value='detail' clearable>
            <div v-for="(item,index) in jibieList" :key="index">
              <el-option :label="item.detail" :value="item" :key="index"></el-option>
            </div>
          </el-select>
        </el-form-item>
        <el-form-item label="单价：" prop="structurevalue">
          <el-input disabled type="number" v-model="listQuery.structurevalue"></el-input>
					<el-tooltip class="item" effect="dark" content="根据“结构等别”和“级别”的组合来自动调入" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
      </div>
      <div class="publicformview-row">
        <el-form-item label="使用面积(住)：" prop="usingarea">
          <el-input disabled type="number" v-model="listQuery.usingarea"></el-input>
        </el-form-item>
        <el-form-item label="使用面积(非)：" prop="nonusingarea">
          <el-input disabled type="number" v-model="listQuery.nonusingarea"></el-input>
        </el-form-item>
        <el-form-item label="总使用面积：" prop="totalusingarea">
          <el-input disabled type="number" v-model="listQuery.totalusingarea"></el-input>
					<el-tooltip class="item" effect="dark" content=" 使用面积（住）+使用（非）" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
        <el-form-item label="占地面积：" prop="coverarea">
          <el-input type="number" v-model="listQuery.coverarea"></el-input>
        </el-form-item>
      </div>
      <div class="publicformview-row">

        <el-form-item label="建筑面积(住)：" prop="buildingarea">
          <el-input disabled type="number" v-model="listQuery.buildingarea"></el-input>
					<el-tooltip class="item" effect="dark" content="建筑面积（住）由建筑面积公式（住）计算，公式为四则运算，包括加+减-乘*除/括号（）等。
" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
        <el-form-item label="建筑面积(非)：" prop="nonbuildingarea">
          <el-input disabled type="number" v-model="listQuery.nonbuildingarea"></el-input>
        </el-form-item>
					<el-tooltip class="item" effect="dark" content="建筑（非）由建筑面积公式（非）计算" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        <el-form-item label="总建筑面积：" prop="totalbuildingarea">
          <el-input disabled type="number" v-model="listQuery.totalbuildingarea"></el-input>
					<el-tooltip class="item" effect="dark" content=" 建筑面积（住）+建筑（非）" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
        <el-form-item label="基底面积：" prop="basearea">
          <el-input type="number" v-model="listQuery.basearea"></el-input>
        </el-form-item>
      </div>
      <div class="publicformview-row">
        <el-form-item label="建筑面积公式(住)：" prop="buildingareaformula">
          <el-input v-model="listQuery.buildingareaformula"></el-input>
        </el-form-item>
        <el-form-item label="建筑面积公式(非)：" prop="nonbuildingareaformula">
          <el-input v-model="listQuery.nonbuildingareaformula"></el-input>
        </el-form-item>
        <el-form-item label="原值：" prop="oldvalue">
          <el-input disabled v-model="listQuery.oldvalue"></el-input>
					<el-tooltip class="item" effect="dark" content="总建筑面积 * 单价" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
        <el-form-item label="现值：" prop="nowvalue">
          <el-input disabled v-model="listQuery.nowvalue"></el-input>
					<el-tooltip class="item" effect="dark" content="原值 * 折旧率（房屋现状 页面）" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
      </div>
      <div class="publicformview-row">
        <el-form-item label="分摊系数(住)：" prop="livingsharerate">
          <el-input disabled v-model="listQuery.livingsharerate"></el-input>
					<el-tooltip class="item" effect="dark" content="分摊系数（住）= 建筑面积（住）/ 使用面积（住）" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
        <el-form-item label="分摊系数(非)：" prop="nonlivingsharerate">
          <el-input disabled v-model="listQuery.nonlivingsharerate"></el-input>
					<el-tooltip class="item" effect="dark" content="分摊（非）= 建筑（非）/ 使用（非）" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
					</el-tooltip>
        </el-form-item>
      </div>
    </el-form>
    <div class="bottomTop" v-if='blockType!=3'>
      <el-button type="primary" size="mini" @click="handleAddUser">保存</el-button>
    </div>

    <el-button v-if="blockno" type="primary" size="mini" @click="dixiashiAdd">添加</el-button>
    <el-table v-if="blockno" max-height='500px' :data="dixiashilist" border fit highlight-current-row size="mini">
     <!-- <el-table-column align="center" label="编号" prop="basementno">
      </el-table-column> -->

      <el-table-column align="center" label="用途" prop="use">
      </el-table-column>

      <el-table-column align="center" label="间数" prop="roomcount">
      </el-table-column>

      <el-table-column align="center" label="面积(平米)" prop="area">
      </el-table-column>

      <el-table-column align="center" label="净高(米)" prop="hight">
      </el-table-column>

      <el-table-column align="center" label="埋深(米)" prop="depth">
      </el-table-column>

      <el-table-column align="center" label="编辑" prop="accumulatewater">
      </el-table-column>

      <el-table-column align="center" label="操作" width="280">
        <template slot-scope="scope">
          <el-button type="text" size="mini" @click="dixiaDetail(scope.row)">修改</el-button>
          <el-button type="text" size="mini" @click="dixiaDelete(scope.row.baseid)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <el-dialog v-if="blockno" :title="dixiaName" :visible.sync="dixiaVisible" width="50%" :before-close="handleClose">
      <el-form :model="dixiaQuery" ref="dixiaForm" class="demo-ruleForm" label-position="right" label-width="150px" :rules='rules'>
      <!--  <el-form-item label="编号：" prop="basementno">
          <el-input v-model="dixiaQuery.basementno"></el-input>
        </el-form-item> -->

        <el-form-item label="用途：" prop="use">
          <el-input v-model="dixiaQuery.use"></el-input>
        </el-form-item>

        <el-form-item label="间数：" prop="roomcount">
          <el-input v-model="dixiaQuery.roomcount"></el-input>
        </el-form-item>
        <el-form-item label="面积(平米)：" prop="area">
          <el-input v-model.number="dixiaQuery.area"></el-input>
        </el-form-item>

        <el-form-item label="净高(米)：" prop="hight">
          <el-input v-model="dixiaQuery.hight"></el-input>
        </el-form-item>

        <el-form-item label="埋深(米)：" prop="depth">
          <el-input v-model="dixiaQuery.depth"></el-input>
        </el-form-item>

        <el-form-item label="编辑：" prop="accumulatewater">
          <el-input v-model="dixiaQuery.accumulatewater"></el-input>
        </el-form-item>

      </el-form>
      <div class="saveContent">
        <el-button type="primary" size="medium" @click='dixiaClick'>保 存</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import dayjs from 'dayjs'
import {
  addBlockDetail,
  blockDetail,
  updBlockDetail,
  getBasement,
  addBasement,
  updBasement,
  delBasement
} from '@/api/industry'
export default {
  props: {
    blockType: String,
    blockid: String,
    blockno: String
  },
  name: 'jianzugouzao',
  data() {
    return {
      listQuery: {
        addresslevelliving: '',
        addresslevelnonliving: '',
        buildingno: '',
        floorcount: '',
        buildingform: '',
        buildingformdetail: '',
        livingway: '',
        livingmix: '',
        structure: '',
        structuredetail: '',
        structurelevel: '',
        structurevalue: '',
        buildyear: '',
        usingarea: '',
        nonusingarea: '',
        roomcount: '',
        coverarea: '',
        buildingarea: '',
        nonbuildingarea: '',
        totalusingarea: '',
        basearea: '',
        livingsharerate: '',
        nonlivingsharerate: '',
        totalbuildingarea: '',
        oldvalue: '',
        nowvalue: '',
        buildingareaformula: '',
        nonbuildingareaformula: '',
        yongtu: '',
        hight: '',
        depth: ''
      },
      total: 0,
      listLoading: false,
      dialogVisible: false,
      isChanquan: true,
      type: 1,
      chanyeList: [],
      // 性质
      xingzhiList: [],
      // 地段等级
      diduandengjiList: [],
      // 建筑形式
      jianzhuxingshiList: [],
      // 建筑形式明细
      jianzhuxingshimingxiList: [],
      // 房屋结构
      fangwujiegouList: [],
      // 结构等别
      jiegoudengbieList: [],
      // 级别
      jibieList: [],
      dixiashilist: [],
      dixiaVisible: false,
      dixiaName: '',
      dixiaQuery: {
        accumulatewater: '',
        depth: '',
        hight: '',
        area: '',
        roomcount: '',
        use: '',
        basementno: ''
      },
      rules: {
        basementno: [
          {
            required: true,
            message: '请输入编号',
            trigger: 'blur'
          }
        ],
        use: [
          {
            required: true,
            message: '请输入用途',
            trigger: 'blur'
          }
        ],
        roomcount: [
          {
            required: true,
            message: '请输入间数：',
            trigger: 'blur'
          }
        ],
        area: [
          {
            required: true,
            message: '请输入面积(平米)：',
            trigger: 'blur'
          }
        ],
        hight: [
          {
            required: true,
            message: '请输入净高(米)：',
            trigger: 'blur'
          }
        ],
        depth: [
          {
            required: true,
            message: '请输入埋深(米)：',
            trigger: 'blur'
          }
        ]
      }
    }
  },

  computed: {},

  mounted() {
    // 遍历字典
    this.chanyeList = JSON.parse(localStorage.getItem('chanye'))
    this.chanyeList.forEach((item, index) => {
      if (item.classname == '地段等级') {
        this.xingzhiList = item.classmidList
      } else if (item.classname == '启始原因') {
        this.qishiyuanyingList = item.classmidList
      } else if (item.classname == '建筑形式') {
        this.jianzhuxingshiList = item.classmidList
      } else if (item.classname == '房屋结构') {
        this.fangwujiegouList = item.classmidList
      }
    })

    if (this.blockid) {
      let data = {
        BlockID: this.blockid
      }
      blockDetail(data).then((res) => {
        console.log(res)
        this.listQuery = res.data
        this.listQuery.livingmix =
          res.data.livingmix == 0 ? '否' : res.data.livingmix == 1 ? '是' : ''
        this.getBasement()
      })
    }
    if (localStorage.getItem('jianzugouzao')) {
      this.listQuery = JSON.parse(localStorage.getItem('jianzugouzao'))
    }
  },

  methods: {
    // 地下室列表
    getBasement() {
      let data = {
        blockno: this.blockno
      }
      getBasement(data).then((res) => {
        console.log(res)
        this.dixiashilist = res.data
      })
    },
    // 添加地下室
    dixiashiAdd() {
      ;(this.dixiaVisible = true), (this.dixiaName = '添加地下室')
    },
    // 修改地下室
    dixiaDetail(row) {
      ;(this.dixiaVisible = true), (this.dixiaName = '修改地下室')
      let object = JSON.stringify(row)
      this.dixiaQuery = JSON.parse(object)
    },
    // 保存地下室
    dixiaClick() {
      this.$refs.dixiaForm.validate((valid) => {
        if (valid) {
          if (this.dixiaName == '添加地下室') {
            this.dixiaQuery.blockno = this.blockno
            addBasement(this.dixiaQuery).then((res) => {
              console.log(res)
              this.$message({
                type: 'success',
                message: '操作成功'
              })
              this.getBasement()
              this.dixiaVisible = false
            })
          } else {
            updBasement(this.dixiaQuery).then((res) => {
              console.log(res)
              this.$message({
                type: 'success',
                message: '操作成功'
              })
              this.getBasement()
              this.dixiaVisible = false
            })
          }
        } else {
          console.log('验证失败！')
          return false
        }
      })
    },
    // 删除地下室
    dixiaDelete(baseid) {
      let data = {
        baseid: baseid
      }
      delBasement(data).then((res) => {
        this.$message({
          type: 'success',
          message: '操作成功'
        })
        this.getBasement()
      })
    },
    // 选择性质
    xinzhiChange(value) {
      console.log(value)
      this.chanyeList.forEach((item, index) => {
        if (item.classname == '地段等级') {
          item.classmidList.forEach((it, idx) => {
            if (value == '住宅' && it.classmid == '住宅') {
              this.diduandengjiList = it.classdetailList
            } else if (value == '非住宅' && it.classmid == '非住宅') {
              this.diduandengjiList = it.classdetailList
            }
          })
        }
      })
    },
    // 选择建筑形式
    jianzhuChange(value) {
      this.chanyeList.forEach((item, index) => {
        if (item.classname == '建筑形式') {
          item.classmidList.forEach((it, idx) => {
            if (value == '楼房' && it.classmid == '楼房') {
              this.jianzhuxingshimingxiList = it.classdetailList
            } else if (value == '平房' && it.classmid == '平房') {
              this.jianzhuxingshimingxiList = it.classdetailList
            }
          })
        }
      })
    },
    // 选择房屋结构
    fangwujiegouChange(value) {
      this.chanyeList.forEach((item, index) => {
        if (item.classname == '房屋结构') {
          item.classmidList.forEach((it, idx) => {
            if (value == '钢混结构' && it.classmid == '钢混结构') {
              this.jiegoudengbieList = it.classdetailList
            } else if (value == '砖混结构' && it.classmid == '砖混结构') {
              this.jiegoudengbieList = it.classdetailList
            } else if (value == '砖木结构' && it.classmid == '砖木结构') {
              this.jiegoudengbieList = it.classdetailList
            } else if (value == '简易结构' && it.classmid == '简易结构') {
              this.jiegoudengbieList = it.classdetailList
            }
          })
        }
      })
    },
    // 结构等别
    jiegoudengbieChange(value) {
      this.chanyeList.forEach((item, index) => {
        if (item.classname == '重置完全价值') {
          item.classmidList.forEach((it, idx) => {
            if (value == '钢混一等' && it.classmid == '钢混一等') {
              this.jibieList = it.classdetailList
            } else if (value == '钢混二等' && it.classmid == '钢混二等') {
              this.jibieList = it.classdetailList
            } else if (value == '砖混一等' && it.classmid == '砖混一等') {
              this.jibieList = it.classdetailList
            } else if (value == '砖混二等' && it.classmid == '砖混二等') {
              this.jibieList = it.classdetailList
            } else if (value == '砖木一等' && it.classmid == '砖木一等') {
              this.jibieList = it.classdetailList
            } else if (value == '砖木二等' && it.classmid == '砖木二等') {
              this.jibieList = it.classdetailList
            } else if (value == '砖木三等' && it.classmid == '砖木三等') {
              this.jibieList = it.classdetailList
            } else if (value == '简易结构' && it.classmid == '简易结构') {
              this.jibieList = it.classdetailList
            }
          })
        }
      })
    },
    // 级别
    jibieChange(e) {
      this.listQuery.structurevalue = e.value
      this.listQuery.structurelevel = e.detail
    },
    resetForm(val) {
      console.log('1')
      this.$refs[val].resetFields()
    },
    handleAddUser() {
      console.log(localStorage.getItem('blockid'))
      if (!this.blockid&&!localStorage.getItem('blockid')) return this.$message('请先填写产权情况')
      let data = {
        addresslevelliving: this.listQuery.addresslevelliving,
        addresslevelnonliving: this.listQuery.addresslevelnonliving,
        buildingno: this.listQuery.buildingno,
        floorcount: this.listQuery.floorcount,
        buildingform: this.listQuery.buildingform,
        buildingformdetail: this.listQuery.buildingformdetail,
        livingway: this.listQuery.livingway,
        livingmix:
          this.listQuery.livingmix == '是'
            ? 1
            : this.listQuery.livingmix == '否'
            ? 0
            : '',
        structure: this.listQuery.structure,
        structuredetail: this.listQuery.structuredetail,
        structurelevel: this.listQuery.structurelevel,
        structurevalue: this.listQuery.structurevalue,
        buildyear: this.listQuery.buildyear,
        usingarea: this.listQuery.usingarea,
        nonusingarea: this.listQuery.nonusingarea,
        roomcount: this.listQuery.roomcount,
        coverarea: this.listQuery.coverarea,
        buildingarea: this.listQuery.buildingarea,
        nonbuildingarea: this.listQuery.nonbuildingarea,
        totalusingarea: this.listQuery.totalusingarea,
        basearea: this.listQuery.basearea,
        livingsharerate: this.listQuery.livingsharerate,
        nonlivingsharerate: this.listQuery.nonlivingsharerate,
        totalbuildingarea: this.listQuery.totalbuildingarea,
        oldvalue: this.listQuery.oldvalue,
        nowvalue: this.listQuery.nowvalue,
        buildingareaformula: this.listQuery.buildingareaformula,
        nonbuildingareaformula: this.listQuery.nonbuildingareaformula,
        yongtu: this.listQuery.yongtu,
        hight: this.listQuery.hight,
        depth: this.listQuery.depth,
        blockid: this.blockid?this.blockid:localStorage.getItem('blockid')
      }
      localStorage.setItem('jianzugouzao', JSON.stringify(data))
      if (this.blockType == 2 || this.blockType == 4) {
        updBlockDetail(data).then((res) => {
          console.log(res)
          this.$message(res.message)
          // this.$router.go(-1)
        })
      } else {
        addBlockDetail(data).then((res) => {
          console.log(res)
          this.$message(res.message)
          // this.$router.go(-1)
        })
      }
    },
    returns() {
      this.$router.go(-1)
    },

    handleClose(done) {
      this.$confirm('确认关闭？')
        .then((_) => {
          done()
        })
        .catch((_) => {})
    }
  },
  beforeDestroy() {
    let data = {
      addresslevelliving: this.listQuery.addresslevelliving,
      addresslevelnonliving: this.listQuery.addresslevelnonliving,
      buildingno: this.listQuery.buildingno,
      floorcount: this.listQuery.floorcount,
      buildingform: this.listQuery.buildingform,
      buildingformdetail: this.listQuery.buildingformdetail,
      livingway: this.listQuery.livingway,
      livingmix: this.listQuery.livingmix,
      structure: this.listQuery.structure,
      structuredetail: this.listQuery.structuredetail,
      structurelevel: this.listQuery.structurelevel,
      structurevalue: this.listQuery.structurevalue,
      buildyear: this.listQuery.buildyear,
      usingarea: this.listQuery.usingarea,
      nonusingarea: this.listQuery.nonusingarea,
      roomcount: this.listQuery.roomcount,
      coverarea: this.listQuery.coverarea,
      buildingarea: this.listQuery.buildingarea,
      nonbuildingarea: this.listQuery.nonbuildingarea,
      totalusingarea: this.listQuery.totalusingarea,
      basearea: this.listQuery.basearea,
      livingsharerate: this.listQuery.livingsharerate,
      nonlivingsharerate: this.listQuery.nonlivingsharerate,
      totalbuildingarea: this.listQuery.totalbuildingarea,
      oldvalue: this.listQuery.oldvalue,
      nowvalue: this.listQuery.nowvalue,
      buildingareaformula: this.listQuery.buildingareaformula,
      nonbuildingareaformula: this.listQuery.nonbuildingareaformula,
      yongtu: this.listQuery.yongtu,
      hight: this.listQuery.hight,
      depth: this.listQuery.depth,
      blockid: this.blockid ? this.blockid : localStorage.getItem('blockid')
    }
    localStorage.setItem('jianzugouzao', JSON.stringify(data))
  }
}
</script>

<style scoped>
.headTop {
  width: 100%;
  display: flex;
  justify-content: space-between;

  .xinxi {
    display: flex;
    width: 800px;
  }
}

.el-form-item {
  justify-content: start !important;
}

.el-select {
  width: 180px;
}

.el-input {
  width: 180px;
}
.publicformview-row {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.el-date-picker {
  width: 180px;
}

.bottomTop {
  width: 100%;
  display: flex;
  justify-content: end;
  margin-bottom: 20px;
}

.tabButton {
  background: #eff2f7;
  color: #333333;
  border: none;
}

.saveContent {
  width: 100%;
  display: flex;
  justify-content: end;
  margin-top: 20px;
  padding-bottom: 20px;
}
/deep/ .el-form-item--mini {
  width: unset;
}

/deep/ .demo-ruleForm input {
  width: 500px;
}
</style>